<template>
  <el-table
    v-loading="listLoading"
    :data="roadEvaluation"
    highlight-current-row
    style="width: 100%;"
  >
    <el-table-column label="评价号" align="center">
      <template slot-scope="{row}">
        <span>{{ row.evaluationResultsID }}</span>
      </template>
    </el-table-column>
    <el-table-column label="定期检测号" align="center">
      <template slot-scope="{row}">
        <span>{{ row.regularInspectionID }}</span>
      </template>
    </el-table-column>
    <el-table-column label="检测时间" align="center">
      <template slot-scope="{row}">
        <span>{{ row.inspectionDate |timeFiler }}</span>
      </template>
    </el-table-column>
    <el-table-column label="综合评价指数" align="center">
      <el-table-column label="PQI" align="center">
        <template slot-scope="{row}">
          <span>{{ row.pqi.toFixed(2) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="总评等级" align="center">
        <template slot-scope="{row}">
          <el-tag :type="getGradeColor(row.overviewGrade)">{{ row.overviewGrade }}</el-tag>
        </template>
      </el-table-column>
    </el-table-column>
    <el-table-column label="平整度" align="center">
      <el-table-column label="RQI" align="center">
        <template slot-scope="{row}">
          <span>{{ row.rqi.toFixed(2) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="IRI" align="center">
        <template slot-scope="{row}">
          <span>{{ row.iri.toFixed(2) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="等级" align="center">
        <template slot-scope="{row}">
          <el-tag :type="getGradeColor(row.drivingGrade)">{{ row.drivingGrade }}</el-tag>
        </template>
      </el-table-column>
    </el-table-column>
    <el-table-column label="破损情况" align="center">
      <el-table-column label="PCI" align="center">
        <template slot-scope="{row}">
          <span>{{ row.pci.toFixed(2) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="等级" align="center">
        <template slot-scope="{row}">
          <el-tag :type="getGradeColor(row.damageGrade)">{{ row.damageGrade }}</el-tag>
        </template>
      </el-table-column>
    </el-table-column>
  </el-table>
</template>
<script>
import { toDateString } from '@/utils/time-handle'
import { searchRoad } from '@/api/road'
export default {
  name: 'EvaluationResult',
  filters: {
    timeFiler(time) {
      return toDateString(time)
    }
  },
  data() {
    return {
      roadEvaluation: [],
      listLoading: true
    }
  },
  created() {
    this.getAllEvaluationResult()
  },
  methods: {
    getAllEvaluationResult() {
      searchRoad({ searchType: 8 }).then(response => {
        this.roadEvaluation = response
        this.$message({
          message: '已刷新年报表信息',
          type: 'success'
        })
        setTimeout(() => {
          this.listLoading = false
        }, 0.5 * 1000)
      })
    },
    getGradeColor(grade) {
      switch (grade) {
        case 'A': return 'success'
        case 'B': return 'primary'
        case 'C': return 'warning'
        case 'D': return 'danger'
      }
    }

  }
}
</script>

